<template>
  <div class="app-container">
    <div ref="refsTable">
      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">

        <div style="display: inline;">
          <el-form-item prop="timeType">
            <el-select v-model="queryParams.timeType" clearable style="width:110px;margin-right:10px ">
              <el-option value label="全部"></el-option>
              <el-option v-for="item in dateList" :key="item.id" :label="item.title" :value="item.id" />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-date-picker v-model="dateRange" style="width: 230px;margin-left:-2px" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
              type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"></el-date-picker>
          </el-form-item>
        </div>

        <el-form-item label="项目类型" prop="projectTypeId">
          <el-autocomplete
            class="inline-input"
            v-model="queryParams.projectTypeName"
            :fetch-suggestions="querySearch"
            placeholder="请选择"
            @select="handleSelectProject"
            @focus="change(1)"
            style="width:220px"
            clearable
          ></el-autocomplete>
          <!-- <el-select v-model="queryParams.projectTypeId" placeholder="全部" clearable style="width: 220px">
            <el-option value label="全部"></el-option>
            <el-option v-for="item in projectTypeList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select> -->
        </el-form-item>

        <el-form-item label="样本类型" prop="sampleTypeId">
          <el-autocomplete
            class="inline-input"
            v-model="queryParams.sampleTypeName"
            :fetch-suggestions="querySearch"
            placeholder="请选择"
            @select="handleSelectSample"
            @focus="change(0)"
            style="width:220px"
            clearable
          ></el-autocomplete>
          <!-- <el-select v-model="queryParams.sampleTypeId" placeholder="全部" clearable style="width: 220px">
            <el-option value label="全部"></el-option>
            <el-option v-for="item in sampleTypeList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select> -->
        </el-form-item>

        <el-form-item label="核酸类型" prop="nucleicAcidTypeId">
          <el-select v-model="queryParams.nucleicAcidTypeId" placeholder="全部" clearable style="width: 220px">
            <el-option value label="全部"></el-option>
            <el-option v-for="item in nucleateTypeList" :key="item.id" :label="item.typeName" :value="item.id" />
          </el-select>
        </el-form-item>
        <div style="display: inline;margin: 0;padding: 0;">
          <el-form-item prop="codeType">
            <el-select v-model="queryParams.codeType" placeholder="入库编码" clearable
              style="width:110px;margin-right:10px ">
              <el-option v-for="item in codeList" :key="item.id" :label="item.title" :value="item.id" />
            </el-select>
          </el-form-item>
          <el-form-item prop="number">
            <el-input v-model="queryParams.number" placeholder="请输入检测编码" clearable style="width: 230px"
              @keyup.enter.native="handleQuery" />
          </el-form-item>
        </div>
        <el-form-item label="检测流程" prop="status">
          <el-select v-model="queryParams.status" placeholder="全部" clearable style="width: 220px">
            <el-option value label="全部"></el-option>
            <el-option v-for="item in statusList" :key="item.id" :label="item.title" :value="item.id" />
          </el-select>
        </el-form-item>

        <el-form-item label="条形码" prop="barcodeCode">
          <el-input v-model="queryParams.barcodeCode" placeholder="请输入条形码" clearable style="width: 220px"
            @keyup.enter.native="handleQuery" />
        </el-form-item>

        <el-form-item label="实验编码" prop="experimentNumber">
          <el-input v-model="queryParams.experimentNumber" placeholder="请输入实验编码" clearable style="width: 220px"
            @keyup.enter.native="handleQuery" />
        </el-form-item>

        
        <el-form-item prop="keyName" label-width="0">
          <el-input v-model="queryParams.keyName" placeholder="送检单位/送检姓名 " clearable
            style="width: 195px" @keyup.enter.native="handleQuery" />
        </el-form-item>

        <el-form-item >
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>

      <el-row :gutter="10" class="mb8" type="flex" justify="space-between">
        <el-col :span="1.5">

        </el-col>
        <el-col :span="1.5">
          <el-dropdown trigger="click" @click="openDropdown" :hide-on-click="false" ref="dropdown"
            style="margin-right: 10px;">
            <el-button type="primary" size="mini">
              自定义列<i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown" style="padding-left: 20px;height: 300px; overflow-y: auto;">
              <el-form>
                <el-form-item>
                  <el-button @click="chooseTitle" type="primary" size="mini">
                确定
              </el-button>
                </el-form-item>
              </el-form>
              
              <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">显示全部
              </el-checkbox>                
              <div ></div>
              <el-checkbox-group v-model="checkedTitle" style="display: flex;flex-direction: column;"
                @change="handleCheckedCitiesChange">
                <el-checkbox v-for="city in tableTitle" :label="city" :key="city"></el-checkbox>
              </el-checkbox-group>
              
            </el-dropdown-menu>
          </el-dropdown>
          <el-dropdown trigger="click">
            <el-button type="primary" size="mini">
              导出<i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item @click.native="handleExport('now')">导出当前</el-dropdown-item>
              <el-dropdown-item @click.native="handleExport('all')">导出全部</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-col>
      </el-row>
    </div>
    <el-table ref="talbes" :row-class-name="rowStyle" border highlight-current-row v-loading="loading" :data="typeList"
      @selection-change="handleSelectionChange" :height="heights" :header-cell-style="{
        background: '#ebebeb'
      }">
      <el-table-column label="序号" align="center" type="index" />
      <af-table-column label="条码号" align="center" prop="barcodeCode" width="120"
        v-if="this.sureTitle.indexOf(tableTitle[0]) != -1" />
      <af-table-column label="项目类型" align="center" width="350" prop="projectTypeName"
        v-if="this.sureTitle.indexOf(tableTitle[1]) != -1">
      </af-table-column>
      <af-table-column label="实验编号" align="center" prop="experimentNumber"
        v-if="this.sureTitle.indexOf(tableTitle[2]) != -1" />
      <af-table-column label="样本状态" align="center" v-if="this.sureTitle.indexOf(tableTitle[3]) != -1">
        <template slot-scope="scope">
          {{ scope.row.mainState == 6 ? analyzeSubStateName[scope.row.mainState] : mainStateName[scope.row.mainState] }}
        </template>
      </af-table-column>
      <af-table-column label="送检姓名" align="center" prop="submitName"
        v-if="this.sureTitle.indexOf(tableTitle[4]) != -1" />
      <af-table-column label="送检单位" align="center" prop="inspectionUnit"
        v-if="this.sureTitle.indexOf(tableTitle[5]) != -1" />
      <af-table-column label="核酸类型" align="center" width="120" prop="nucleicTypeName"
        v-if="this.sureTitle.indexOf(tableTitle[6]) != -1" />
      <af-table-column label="平台类型" align="center" prop="platformTypeName"
        v-if="this.sureTitle.indexOf(tableTitle[7]) != -1" />
      <af-table-column label="样本类型" align="center" width="150" prop="sampleTypeName"
        v-if="this.sureTitle.indexOf(tableTitle[8]) != -1" />
      v
      <af-table-column label="录入时间" align="center" prop="registerCreateDate"
        v-if="this.sureTitle.indexOf(tableTitle[9]) != -1" width="160" />

      <af-table-column label="登记人" align="center" prop="registerPerson" width="100"
        v-if="this.sureTitle.indexOf(tableTitle[10]) != -1" />

      <af-table-column label="登记时间" align="center" prop="registrationTime"
        v-if="this.sureTitle.indexOf(tableTitle[11]) != -1" width="160"/>
      <af-table-column label="入库样本编号" align="center" prop="inputSampleNumber"
        v-if="this.sureTitle.indexOf(tableTitle[12]) != -1" />
      <af-table-column label="入库批次号" align="center" prop="inputBatchNumber"
        v-if="this.sureTitle.indexOf(tableTitle[13]) != -1" />
      <af-table-column label="入库人" align="center" prop="inputPerson"
        v-if="this.sureTitle.indexOf(tableTitle[14]) != -1" />
      <af-table-column label="入库日期" align="center" prop="inputDate" width="160"
        v-if="this.sureTitle.indexOf(tableTitle[15]) != -1" />

      <af-table-column label="提取人" align="center" prop="extractPerson"
        v-if="this.sureTitle.indexOf(tableTitle[16]) != -1" />
      <af-table-column label="提取日期" align="center" prop="extractDate" width="160"
        v-if="this.sureTitle.indexOf(tableTitle[17]) != -1" />
      <af-table-column label="提取样本编号" align="center" prop="extractSampleNumber"
        v-if="this.sureTitle.indexOf(tableTitle[18]) != -1" />
      <af-table-column label="提取批次号" align="center" prop="extractBatchNumber"
        v-if="this.sureTitle.indexOf(tableTitle[19]) != -1" />
      <af-table-column label="建库人" align="center" prop="buildPerson"
        v-if="this.sureTitle.indexOf(tableTitle[20]) != -1" />
      <af-table-column label="建库日期" align="center" prop="buildDate" width="160"
        v-if="this.sureTitle.indexOf(tableTitle[21]) != -1" />
      <af-table-column label="建库样本编号" align="center" prop="extractSampleNumber"
        v-if="this.sureTitle.indexOf(tableTitle[22]) != -1" />
      <af-table-column label="建库批次号" align="center" prop="extractBatchNumber"
        v-if="this.sureTitle.indexOf(tableTitle[23]) != -1" />
      <af-table-column label="测序人" align="center" prop="sequencingPerson"
        v-if="this.sureTitle.indexOf(tableTitle[24]) != -1" />
      <af-table-column label="测序日期" align="center" prop="sequencingDate" width="160"
        v-if="this.sureTitle.indexOf(tableTitle[25]) != -1" />
      <af-table-column label="测序样本编号" align="center" prop="sequencingSampleNumber"
        v-if="this.sureTitle.indexOf(tableTitle[26]) != -1" />
      <af-table-column label="测序批次号" align="center" prop="sequencingBatchNumber"
        v-if="this.sureTitle.indexOf(tableTitle[27]) != -1" />
      <af-table-column label="分析人" align="center" prop="analyzePerson"
        v-if="this.sureTitle.indexOf(tableTitle[28]) != -1" />
      <af-table-column label="分析日期" align="center" prop="analyzeDate" width="160"
        v-if="this.sureTitle.indexOf(tableTitle[29]) != -1" />
      <af-table-column label="分析样本编号" align="center" prop="analyzeSampleNumber"
        v-if="this.sureTitle.indexOf(tableTitle[30]) != -1" />
      <af-table-column label="分析批次号" align="center" prop="analyzeBatchNumber"
        v-if="this.sureTitle.indexOf(tableTitle[31]) != -1" />
      

      <af-table-column label="提取样本量" align="center" v-if="this.sureTitle.indexOf(tableTitle[32]) != -1">
        <!-- ???-->
        <template slot-scope="scope">
          {{ scope.row.technicalExtractManagement['提取样本量'] }}
        </template>
      </af-table-column>
      <af-table-column label="提取核酸液度(nglul)" align="center" v-if="this.sureTitle.indexOf(tableTitle[33]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalExtractManagement['提取核酸液度'] }}
        </template>
      </af-table-column>
      <af-table-column label="提取核酸体积(ul)" align="center" v-if="this.sureTitle.indexOf(tableTitle[34]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalExtractManagement['提取核酸体积'] }}
        </template>
      </af-table-column>

      <af-table-column label="提取核酸总量(ng)" align="center" v-if="this.sureTitle.indexOf(tableTitle[35]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalExtractManagement['提取核酸总量'] }}
        </template>
      </af-table-column>
      <af-table-column label="A260/A280" align="center" v-if="this.sureTitle.indexOf(tableTitle[36]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalExtractManagement['A260/A230'] }}
        </template>
      </af-table-column>
      <af-table-column label="A260/A230" align="center" v-if="this.sureTitle.indexOf(tableTitle[37]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalExtractManagement['A260/A280'] }}
        </template>
      </af-table-column>
      <af-table-column label="样本等级" align="center" prop="sampleLevel"
        v-if="this.sureTitle.indexOf(tableTitle[38]) != -1" />


      <af-table-column label="建库投入量(ng)" align="center" v-if="this.sureTitle.indexOf(tableTitle[39]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement['建库投入量'] }}
        </template>
      </af-table-column>
      <af-table-column label="index" align="center" v-if="this.sureTitle.indexOf(tableTitle[40]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement.index }}
        </template>
      </af-table-column>
      <af-table-column label="PCR cycles" align="center" v-if="this.sureTitle.indexOf(tableTitle[41]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement['PCR cycles'] }}
        </template>
      </af-table-column>
      <af-table-column label="文库浓度(ng/ul)" align="center" v-if="this.sureTitle.indexOf(tableTitle[42]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement['文库浓度'] }}
        </template>
      </af-table-column>
      <af-table-column label="文库体积(ul)" align="center" v-if="this.sureTitle.indexOf(tableTitle[43]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement['文库体积'] }}
        </template>
      </af-table-column>
      <af-table-column label="文库总量(ng)" align="center" v-if="this.sureTitle.indexOf(tableTitle[44]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement['文库总量'] }}
        </template>
      </af-table-column>
      <af-table-column label="文库大小" align="center" v-if="this.sureTitle.indexOf(tableTitle[45]) != -1">
        <!-- ???-->
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement['文库大小'] }}
        </template>
      </af-table-column>

      <af-table-column label="测序数据量" align="center" prop="sequencingDataAmount"
        v-if="this.sureTitle.indexOf(tableTitle[46]) != -1" />
      <af-table-column label="测序仪器" align="center" prop="sequencingInstrument"
        v-if="this.sureTitle.indexOf(tableTitle[47]) != -1" />
      <af-table-column label="芯片编号" align="center" v-if="this.sureTitle.indexOf(tableTitle[48]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalSequencingManagement['芯片编号'] }}
        </template>
      </af-table-column>
      <af-table-column label="提取质控是否合格" align="center" v-if="this.sureTitle.indexOf(tableTitle[49]) != -1">
        <template slot-scope="scope">
          {{ scope.row.qualityExtractControlStatus === 0 ? '不合格' : '合格' }}
        </template>
      </af-table-column>

      <af-table-column label="建库质控是否合格" align="center" v-if="this.sureTitle.indexOf(tableTitle[50]) != -1">
        <template slot-scope="scope">
          {{ scope.row.qualityBuildControlStatus === 0 ? '不合格' : '合格' }}
        </template>
      </af-table-column>

      <af-table-column label="测序质控是否合格" align="center" v-if="this.sureTitle.indexOf(tableTitle[51]) != -1">
        <template slot-scope="scope">
          {{ scope.row.sequencingRunStatus === 0 ? '不合格' : '合格' }}
        </template>
      </af-table-column>


      <af-table-column label="提取质控内容" align="center" v-if="this.sureTitle.indexOf(tableTitle[52]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalExtractManagement['质控内容'] }}
        </template>
      </af-table-column>
      <af-table-column label="建库质控内容" align="center" v-if="this.sureTitle.indexOf(tableTitle[53]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalBuildManagement['质控内容'] }}
        </template>
      </af-table-column>
      <af-table-column label="测序质控内容" align="center" v-if="this.sureTitle.indexOf(tableTitle[54]) != -1">
        <template slot-scope="scope">
          {{ scope.row.technicalSequencingManagement['质控内容'] }}
        </template>
      </af-table-column>
      <af-table-column label="是否作废" align="center" v-if="this.sureTitle.indexOf(tableTitle[55]) != -1">
        <template slot-scope="scope">
          {{ scope.row.isVoid === 0 ? '否' : '是' }}
        </template>
      </af-table-column>
      <af-table-column label="作废原因" align="center" prop="reasonContent"
        v-if="this.sureTitle.indexOf(tableTitle[56]) != -1" />
      <af-table-column label="备注" align="center" prop="remark" v-if="this.sureTitle.indexOf(tableTitle[57]) != -1" />
    </el-table>
    <div>
      <pagination   style="margin:0;padding: 0;" :total="total" :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize" @pagination="getList" />
    </div>

  </div>
</template>

<script>
import { technologyList } from '@/api/comprehensiveSearchManage/technology'
import { nucleateType } from '@/api/dictionary/systemDictionary/nucleateType'
import { projectType } from '@/api/dictionary/systemDictionary/projectType'
import { sampleType } from '@/api/dictionary/systemDictionary/sampleType'
const titleOptions = ['条码号', '项目类型', '实验编号', '状态', '送检姓名', '送检单位', '核酸类型', '平台类型', '样本类型', '录入时间', '登记人', '登记时间', '入库样本编号', '入库批次号', '入库人', '入库日期', '提取人', '提取日期', '提取样本编号', '提取批次号', '建库人', '建库日期', '建库样本编号', '建库批次号', '测序人', '测序日期', '测序样本编号', '测序批次号', '分析人', '分析日期', '分析样本编号', '分析批次号', '提取样本量', '提取核酸液度(nglul)', '提取核酸体积(ul)', '提取核酸总量(ng)', 'A260/A280', 'A260/A230', '样本等级', '建库投入量(ng)', 'index', 'PCR cycles', '文库浓度(ng/ul)', '文库体积(ul)', '文库总量(ng)', '文库大小', '测序数据量', '测序仪器', '芯片编号', '提取质控是否合格', '建库质控是否合格', '测序质控是否合格', '提取质控内容', '建库质控内容', '测序质控内容', '是否作废', '作废原因', '备注']
import { arr, Arr } from "@/utils/data.js";
export default {
  name: 'technology',
  data () {
    return {
      pickerOptions: {
        disabledDate(time){
          return time.getTime()>Date.now()
        },
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
            picker.$emit('pick', [start, end]);
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
            picker.$emit('pick', [start, end]);
          }
        }, {
          text: '最近三个月',
          onClick(picker) {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
            picker.$emit('pick', [start, end]);
          }
        }]
      },
      checkAll: false,
      checkedTitle: [],
      tableTitle: [],
      sureTitle: [],
      isIndeterminate: true,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 预警数据
      typeList: [],
      // 项目数据
      projectTypeList: [],
      // 样本数据
      sampleTypeList: [],
      // 核酸数据
      nucleateTypeList: [],
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      // 状态数据字典
      statusOptions: [],
      // 登记日期范围
      dateRange: [],
      // 录入时间范围
      entryRange: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        codeType: 0,
        timeType: 0,
        sampleTypeId: '',
        projectTypeId: '',
        number: undefined,
        nucleicAcidTypeId: '',
        keyName: undefined,
        experimentNumber: undefined,
        barcodeCode: undefined,
        status:''
      },
      mainStateName: {
        1: '已录入',
        2: '已登记',
        3: '已入库',
        4: '已提取',
        5: '已建库',
        6: '已测序',
        7: '已分析',
        8: '已初审',
        9: '已确认初审',
        10: '已复审',
        11: '已提交',
        12: '已上传',
        13: '不上传'
      },
      analyzeSubStateName: {
        0: '待分析',
        1: '分析中',
        2: '分析失败',
        3: '分析成功'
      },

      dateList: [
        {
          title: '登记日期',
          id: 0
        },
        {
          title: '录入时间',
          id: 1
        },
        {
          title: '入库日期',
          id: 2
        },
        {
          title: '提取日期',
          id: 3
        },
        {
          title: '建库日期',
          id: 4
        },
        {
          title: '测序日期',
          id: 5
        }
      ],
      codeList: [
        {
          title: '入库编码',
          id: 0
        },
        {
          title: '提取编码',
          id: 1
        },
        {
          title: '建库编码',
          id: 2
        },
        {
          title: '测序编码',
          id: 3
        }
      ],
      statusList: [
        {
          title: '已录入',
          id: 1
        },
        {
          title: '已登记',
          id: 2
        },
        {
          title: '已入库',
          id: 3
        },
        {
          title: '已提取',
          id: 4
        },
        {
          title: '已建库',
          id: 5
        },
        {
          title: '已测序',
          id: 6
        },
        {
          title: '已分析',
          id: 7
        },
        {
          title: '已初审',
          id: 8
        },
        {
          title: '已确认初审',
          id: 9
        },
        {
          title: '已复审',
          id: 10
        },
        {
          title: '已提交',
          id: 11
        },
        {
          title: '已上传',
          id: 12
        },
        {
          title: '不上传',
          id: 13
        }
      ],
      heights: undefined,
      sampleTypeList2:[],
      projectTypeList2:[],
      restaurants: [],
    }
  },
  created () {
   
    this.dateRange[0] = this.parseTime(new Date((new Date).getTime()), '{y}-{m}-{d}')
    this.dateRange[1] = this.parseTime(new Date((new Date).getTime()), '{y}-{m}-{d}')
    this.getList()
    this.otherList()
    this.getTable()
    Arr.sampleTypeArr.map(el=>{
      this.sampleTypeList2.push({
        value:el.name,
        id:el.id
      })
    })
    Arr.projectTypeArr.map(el=>{
      this.projectTypeList2.push({
        value:el.name,
        id:el.id
      })
    }) 
  },
  mounted () {
    this.$nextTick(() => {
      // 根据浏览器高度设置初始高度
      this.heights = window.innerHeight - this.$refs.refsTable.offsetHeight - 160
      // 监听浏览器高度变化，修改表格高度
      window.onresize = () => {
        this.heights = window.innerHeight - this.$refs.refsTable.offsetHeight - 160
      }
    })
  },
  methods: {
    handleSelectSample(item) {
      this.queryParams.sampleTypeId=item.id
    },
    handleSelectProject(item){
      this.queryParams.projectTypeId=item.id
    },
    // 下拉框
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        );
      };
    },
    // 多个下拉框的数据
    loadAll() {
      const array = [
        this.sampleTypeList2,
        this.projectTypeList2,
      ];
      return array;
    },
    handleSelect(item) {
      console.log(item);
    },
    // 聚焦下拉框时
    change(i) {
      this.restaurants = this.loadAll()[i];
      // console.log(this.restaurants);
    },
    /** 预警 */
    getList () {
      this.loading = true
      technologyList(this.addParameter(this.queryParams, this.dateRange)).then(response => {
        this.typeList = response.rows
        this.total = response.total
        this.loading = false
      }
      )
    },
    otherList () {
      projectType().then(response => {
        this.projectTypeList = response.rows
      })
      sampleType().then(response => {
        this.sampleTypeList = response.rows
      })
      nucleateType().then(response => {
        this.nucleateTypeList = response.rows
      })
    },
    addParameter (params, dateRange) {
      var search = params
      search.startTime = ""
      search.endTime = ""
      if (null != dateRange && '' != dateRange) {
        search.startTime = dateRange[0]
        search.endTime = dateRange[1]
      }


      return search
    },
    // 表单重置
    reset () {
      this.form = {
        pageNum: 1,
        pageSize: 20,
        codeType: 0,
        timeType: 0,
        sampleTypeId: undefined,
        projectTypeId: undefined,
        number: undefined,
        nucleicAcidTypeId: undefined,
        keyName: undefined,
        experimentNumber: undefined,
        barcodeCode: undefined,
        startTime: undefined,
        endTimeL: undefined,
        status: undefined
      }
      this.resetForm('form')
    },
    /** 搜索按钮操作 */
    handleQuery () {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery () {
      this.dateRange = []
      this.resetForm('queryForm')
      this.handleQuery()
    },
    // 多选框选中数据
    handleSelectionChange (selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length != 1
      this.multiple = !selection.length
    },
    // /** 导出按钮操作 */
    handleExport (e) {
      var different = ''
      var params = ''
      if (e === 'now') {
        different = '当前'
        params = this.queryParams //对应接口参数
      } else if (e === 'all') {
        different = '所有'
        params = null
      } else {
        return
      }
      let that = this
      let loading
      this.$confirm('是否确认导出' + different + '数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        loading = that.$loading({
          lock: true,
          text: '导出中',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        })
        technologyList(params).then((response) => {
          let mydata = [
            [
              '序号',
              '条码号',
              '项目类型',
              '实验编号',
              '状态',
              '送检姓名',
              '送检单位',
              '核酸类型',
              '平台类型',
              '样本类型',
              '录入时间',
              '登记人',
              '登记时间',
              '入库样本编号',
              '入库批次号',
              '入库人',
              '入库日期',
              '提取人',
              '提取日期',
              '提取样本编号',
              '提取批次号',
              '建库人',
              '建库日期',
              '建库样本编号',
              '建库批次号',
              '测序人',
              '测序日期',
              '测序样本编号',
              '测序批次号',
              '分析人',
              '分析日期',
              '分析样本编号',
              '分析批次号',
              '提取样本量',
              '提取核酸液度(nglul)',
              '提取核酸体积(ul)',
              '提取核酸总量(ng)',
              'A260/A280',
              'A260/A230',
              '样本等级',
              '建库投入量(ng)',
              'index',
              'PCR cycles',
              '文库浓度(ng/ul)',
              '文库体积(ul)',
              '文库总量(ng)',
              '文库大小',
              '测序数据量',
              '测序仪器',
              '芯片编号',
              '提取质控是否合格',
              '建库质控是否合格',
              '测序质控是否合格',
              '提取质控内容',
              '建库质控内容',
              '测序质控内容',
              '是否作废',
              '作废原因',
              '备注',
            ],
            ...response.rows.map((item, index) => ([
              index + 1,
              item.barcodeCode,
              item.projectTypeName,
              item.experimentNumber,
              item.mainState === 6 ? that.analyzeSubStateName[item.mainState] : that.mainStateName[item.mainState],
              item.submitName,
              item.inspectionUnit,
              item.nucleicTypeName,
              item.platformTypeName,
              item.sampleTypeName,
              item.registerCreateDate,
              item.registerPerson,
              item.registrationTime,
              item.inputSampleNumber,
              item.inputBatchNumber,
              item.inputPerson,
              item.inputDate,
              item.extractPerson,
              item.extractDate,
              item.extractSampleNumber,
              item.extractBatchNumber,
              item.buildPerson,
              item.buildDate,
              item.extractSampleNumber,
              item.extractBatchNumber,
              item.sequencingPerson,
              item.sequencingDate,
              item.sequencingSampleNumber,
              item.sequencingBatchNumber,
              item.analyzePerson,
              item.analyzeDate,
              item.analyzeSampleNumber,
              item.analyzeBatchNumber,
              item.technicalExtractManagement['提取样本量'],
              item.technicalExtractManagement['提取核酸液度'],
              item.technicalExtractManagement['提取核酸体积'],
              item.technicalExtractManagement['提取核酸总量'],
              item.technicalExtractManagement['A260/A230'],
              item.technicalExtractManagement['A260/A280'],
              item.sampleLevel,
              item.technicalBuildManagement['建库投入量'],
              item.technicalBuildManagement.index,
              item.technicalBuildManagement['PCR cycles'],
              item.technicalBuildManagement['文库浓度'],
              item.technicalBuildManagement['文库体积'],
              item.technicalBuildManagement['文库总量'],
              item.technicalBuildManagement['文库大小'],
              item.sequencingDataAmount,
              item.sequencingInstrument,
              item.technicalSequencingManagement['芯片编号'],
              item.qualityExtractControlStatus === 0 ? '不合格' : '合格',
              item.qualityBuildControlStatus === 0 ? '不合格' : '合格',
              item.sequencingRunStatus === 0 ? '不合格' : '合格',
              item.technicalExtractManagement['质控内容'],
              item.technicalBuildManagement['质控内容'],
              item.technicalSequencingManagement['质控内容'],
              item.isVoid === 0 ? '否' : '是',
              item.reasonContent,
              item.remark,
            ]))
          ]
          let requireMerge = []
          that.$util.createxlsx({
            mydata,
            fileName: '技术管理查询',
            dataList: response.rows,
            type: 'orderId',
            requireMerge,
            loading
          })
        })
      }).catch(function () { })
    },
    getTable () {
      console.log(titleOptions.length)
      this.checkedTitle = titleOptions
      this.tableTitle = titleOptions
      if (this.sureTitle.length < 1) {
        this.sureTitle = titleOptions
      }
    },
    handleCheckAllChange (val) {
      this.checkedTitle = val ? this.tableTitle : []
      this.isIndeterminate = false
    },
    handleCheckedCitiesChange (value) {
      let checkedCount = value.length
      this.checkAll = checkedCount === this.tableTitle.length
      this.isIndeterminate = checkedCount > 0 && checkedCount < this.tableTitle.length
    },
    openDropdown () {
      this.$refs.dropdown.show()
    },
    chooseTitle () {
      this.$nextTick(() => {
        this.sureTitle = this.checkedTitle
      })
      this.$refs.dropdown.hide()
    },


    rowStyle ({ row }) {
      var arr = this.ids
      for (let i = 0; i < arr.length; i++) {
        if (row.id === arr[i]) {
          return 'rowStyle'
        }
      }
    }
  }
}
</script>
<style scoped>
.el-form-item {
  margin-bottom: 10px !important;
}

.app-container {
  height: 85vh;
}

::v-deep .el-table__body tr.current-row>td {

  background: #a8d6fe !important;
}

::v-deep .rowStyle {
  background-color: #a8d6fe !important;
}

::v-deep .el-table__body tr:hover>td {
  background: #a8d6fe !important;
}

::-webkit-scrollbar {
  display: none;
}
</style>
